const video = document.getElementById('video');
const play = document.getElementById('play');
const stop = document.getElementById('stop');
const progress = document.getElementById('progress');
const timestamp = document.getElementById('timestamp');

// 事件监听器
video.addEventListener('click', toggleVideoStatus);
video.addEventListener('pause', updatePlayIcon);
video.addEventListener('play', updatePlayIcon);
video.addEventListener('timeupdate', updateProgress);

play.addEventListener('click', toggleVideoStatus);
stop.addEventListener('click', stopVideo);
progress.addEventListener('change', setVideoProgress);

// 播放 & 暂停视频
function toggleVideoStatus() {
    if(video.paused){
        video.play();
    }else{
        video.pause();
    }
}

// 更新播放 / 暂停图标
function updatePlayIcon() {
    if(video.paused){
        play.innerHTML = '<i class="fa fa-play fa-2x"></i>';
    }else{
        play.innerHTML ='<i class="fa fa-play fa-2x"></i>';
    }
}

// 更新进度条 & 时间戳
function updateProgress() {
    progress.value=(video.currentTime/video.duration)*100;


//获得分数
let mins =Math.floor(video.currentTime/60);
if(mins<10){
    mins='0'+String(mins);
 }
 //获得秒数
 let secs = Math.floor(video.currentTime %60);
 if(mins <10){
    mins ='0'+ String(secs);
 }

 timestamp.innerHTML='$(mins}:{secs}';
}

// 在进度条上设置视频时间
function setVideoProgress() {
    video.currentTime=(+progress.value * video.duration)/100;
}

// 停止视频
function stopVideo() {
    video.currentTime=0;
    return true;
}


// 事件监听器
video.addEventListener('click', toggleVideoStatus);
video.addEventListener('pause', updatePlayIcon);
video.addEventListener('play', updatePlayIcon);
video.addEventListener('timeupdate', updateProgress);
play.addEventListener('click', toggleVideoStatus);
stop.addEventListener('click', stopVideo); 